<template>
  <div class="time-box">
    <div class="time">
      <span class="title-head" v-show="$store.state.path!=='/party/religion'">{{$store.state.theader.label}}</span>

      <span v-for="item in head" :class="{active:item.active,'my-head-choose':true}" @click="changeHead(item)" v-show="$store.state.path=='/party/religion'">{{item.name}}</span>

      <span @click="backThis" v-show="$store.state.theader.showback" class="fr box-size my-btn"><img :src="imgs.back" alt="" class="ver-middle back-img"><span class="ver-middle">返回</span></span>
      <span @click="frashThis" v-show="$store.state.theader.showfrash" class="fr box-size my-btn refrash"><img :src="imgs.load" alt="" class="ver-middle"><span class="ver-middle">刷新</span></span>
    </div>
    <div class="content-box">
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      imgs:{
        load:require("../../assets/img/homepageImg/icon-refresh@2x.png"),
        back:require("../../assets/img/homepageImg/arrow-left@2x.png")
      },

      head:[
        {name:"新闻公告",active:true,type:"7"},
        {name:"提案信息",active:false,type:"8"}
      ],

      hasBackArray:[]
    };
  },
  methods:{
    backThis(){
      this.$store.state.theader.showback=false
      this.$store.state.theader.showfrash=true
      var path=this.$router.history.current.path
      if(path.indexOf("/boaters/info/")>-1){
        this.$store.state.theader.label="船员信息"
      }
      this.$router.go(-1)
    },
    changeHead(item){
      this.head.forEach(ele=>{
        ele.active=false
      })
      this.$set(item,"active",true)
      bus.$emit("changeRelation",item.type)
    },
    frashThis(){
      var routerpath = _g.getRouterPath(this);
      _g.showloading("用力刷新中")
      this.$store.state.reflash.contentReflash=false
      this.$store.state.selectIdArray=[]
      
        if (store.state.searchData[to.path.slice(1)]) {
          var array=["/securityinsurance","/securityinfo"]
          
          store.state.searchData[to.path.slice(1)] = { page: 1, listRows: array.includes(to.path)?100:10, time: [] }

          
        }
      if (this.$store.state.searchSetData[routerpath.slice(1)]) this.$store.state.searchSetData[routerpath.slice(1)].forEach(ele => {
        ele.value = ""
        ele.start = ""
        ele.end = ""
        if(ele.startTime)ele.startTime=""
        if(ele.endTime)ele.endTime=""
      });
      setTimeout(()=>{
        this.$store.state.reflash.contentReflash=true
        _g.closeloading(this,"刷新成功")
      },500)
    },

    getTimebarName(){
      var path = _g.getRouterPath(this)
      if(path=="/student"||path=="/student/add"){
        this.$store.state.theader.label= "学生管理"
      }else if(path.indexOf("/student/detail/")>-1){
        this.$store.state.theader.label= "学生详情"
      }

      // if(array[count].children){
      //   for(var i=0;i<array[count].children.length;i++){
      //     if(array[count].children[i].url==path){
      //       this.$store.state.tablename=array[count].tablename
      //       return array[count].children[i].name
      //     }
      //   }
      //   count=count+1
      //   return this.getTimebarName(array,path,count)
      // }else{
      //   if(array[count].url==path){
      //     this.$store.state.tablename=array[count].tablename
      //     return array[count].name
      //   }else{
      //     count=count+1
      //     return this.getTimebarName(array,path,count)
      //   }
      // }
      this.$store.state.commonMenu.forEach(ele => {
        if(ele.children){
          this.$store.state.tablename=ele.children.find(val=>val.url==path)?ele.children.find(val=>val.url==path).tablename:(this.$store.state.tablename||"")
          this.$store.state.theader.label=ele.children.find(val=>val.url==path)?ele.children.find(val=>val.url==path).name:(this.$store.state.theader.label||"")
        }else if(ele.url===path){
          this.$store.state.tablename=ele.tablename
          this.$store.state.theader.label=ele.name
        }
      });
      console.log(this.$store.state.tablename);
    }
  },
  components: {},
  created() {
    var routerpath = _g.getRouterPath(this);
    this.$store.state.path=routerpath
    this.getTimebarName()

  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.time-box{
  background-color: #fff;
  padding: 0;
  /* overflow: hidden */
}
.time {
  line-height: 50px;
  height: 50px;
  border-bottom: 1px solid #E4E4E4;
  background-color: #f0f0f0;
  padding: 0 8%;
  max-width: 1500px;
  margin: 0 auto;
}
.content-box{
  padding: 0 8%
}
.title-head {
  /* display: inline-block; */
  font-size: 13px;
  /* margin-left: 28px; */
  padding-left: 10px;
  color: #999;
  border-left: 4px solid #2C66A1;
}
.fr{
  /* margin-right: 28px; */
  line-height: 19px;
  width: 80px;
  margin-top: 10px;
  margin-left: 10px;
}
.refrash:hover img{
  transform: rotateZ(-180deg)
}
img{
  display: inline-block;
  width: 17px;
  margin: 0 13px 0 10px;
  transition: all 1s
}
.back-img{
  width: 10px;
}
.my-head-choose{
  color: #333;
  font-size: 13px;
  float: left;
  width: 100px;
  background-color: #fff;
  text-align: center;
  height: 50px;
  box-sizing: border-box;
  border-left: 1px solid #e0e0e0;
  cursor: pointer;
}
.my-head-choose:nth-last-of-type(1){
  border-right: 1px solid #e0e0e0;
}
.my-head-choose.active{
  background-color: rgba(0, 153, 255, 1);
  color: #fff!important;
}
.my-head-choose:hover{
  color: rgba(0, 153, 255, 1);
}
</style>
